<html>
<head>
<meta http-equiv="Content-Type" content="text/html"><title>OpenLayers Utilities</title>
<script src="http://openlayers.org/api/OpenLayers.js"></script>
<script src="features/utils.js"></script>
<link rel="stylesheet" href="features/style.css" type="text/css" />
</head>

<body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF" onload="load('polygons');">

<div class="informaltable">
<table border="1">
<colgroup>
<col><col></colgroup>
<tbody>
<tr><td>
<div class="informalfigure">
<div class="mediaobject">

<div id="mapcontainer">
<div id="map"></div>
</div>
<a href="javascript:raiseSelectedFeature();">raise</a>
<a href="javascript:lowerSelectedFeature();">lower</a>
<div id="olGeomType">serialized shape here</div>
<ul id="geometry">
    <li>
    <label for="point">point</label>
    <input type="radio" name="type" value="none" id="point" onclick="load('point');" checked="checked" />
    </li>
    <li>
    <label for="polygon">polygon</label>
    <input type="radio" name="type" value="none" id="polygon" onclick="load('polygon');" />
    </li>
    <li>
    <label for="multipolygon">multipolygon</label>
    <input type="radio" name="type" value="none" id="multipolygon" onclick="load('multipolygon');" />
    </li>
</ul>
<select id="function">
    <option value="ST_Intersects" selected="selected">Intersects</option>
    <option value="ST_Union">Union</option>
    <option value="ST_CascadedUnion">Cascaded Union</option>
</select>
<br />

<div id="dothis">Select features to see their Well Known Text Geometry</div>
<div class="note" id="insert"></div>
<li><a href="javascript:view_svg();">View as SVG</a></li>
<li><a href="javascript:export_vectors();">Export Vector Data</a></li>
<li><a href="javascript:download_svg();">Download Vector Data</a></li>
<label for="union">Generate Union of Selected Features?</label>
<input id="union" type="checkbox" name="prettyPrint" value="true" />
<div class="note" id="unioned"></div>
</div>
</div>
</td></tr>
</tbody>
</table>
</div>

<script type="text/javascript">
    function load(geom){
      $('map').innerHTML = ''
      init(geom); 
    }
</script>
<textarea id="text">Add feature as WKT by pasting here...</textarea>
<br />
<input type="button" value="add feature" onclick="deserialize();" />
<a id="vectorlink" href="" style="display:none">Display via data: URL (FF Only)</a>
<textarea id="vectors" style="display:none;width:100%" rows="10"></textarea>
<div id="data">
</div>
</body>
</html>